﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>Track Editor</title>
    <script src="FileUtils.js"></script>
    <script src="Resources.js"></script>
    <script src="Tracks.js"></script>
</head>
<body>
    <canvas id="track" height="480" width="480"></canvas>
    <script type="text/ecmascript">
        function addEventHandler(obj, evt, handler) {
            if (obj.addEventListener) {
                // W3C method
                obj.addEventListener(evt, handler, false);
            } else if (obj.attachEvent) {
                // IE method.
                obj.attachEvent('on' + evt, handler);
            } else {
                // Old school method.
                obj['on' + evt] = handler;
            }
        }


        function readTrack(trackFile) {
            var stuntTrack = new Tracks.StuntTrack();
            var track = stuntTrack.Read(trackFile);
            var trackCanvas = document.getElementById("track");
            var context = trackCanvas.getContext("2d");


            for (var x = 0; x < track.SizeX; x++) for (var y = 0; y < track.SizeY; y++) {
                var el = track.Elements[x][y];

                var terrainImg = Tracks.TerrainTiles[el.Terrain];
                if (terrainImg != null) {
                    context.drawImage(terrainImg.Image, x * 16, y * 16);
                }
            }

            for (var x = 0; x < track.SizeX; x++) for (var y = 0; y < track.SizeY; y++) {
                var el = track.Elements[x][y];

                var trackImg = Tracks.TrackTiles[el.Obj];
                if (trackImg != null) {
                    context.drawImage(trackImg.Image, x * 16, y * 16);
                }
            }
        }

        if (window.FileReader) {
            addEventHandler(window, 'load', function () {
                var drop = document.getElementById('track');

                function cancel(e) {
                    if (e.preventDefault) { e.preventDefault(); }
                    return false;
                }

                // Tells the browser that we *can* drop on this target
                addEventHandler(drop, 'dragover', cancel);
                addEventHandler(drop, 'dragenter', cancel);

                addEventHandler(drop, 'drop', function (e) {
                    e = e || window.event; // get window.event if e argument missing (in IE)   
                    if (e.preventDefault) { e.preventDefault(); } // stops the browser from redirecting off to the image.

                    var dt = e.dataTransfer;
                    var files = dt.files;
                    var file = files[0];

                    FileUtils.Reader.ReadBlob(file, readTrack);

                    return false;
                });
            });
        } else {
            document.getElementById('status').innerHTML = 'Your browser does not support the HTML5 FileReader.';
        }


    </script>

    <input type="file" id="filereader" onchange="FileUtils.Reader.ReadBlob(this.files[0], readTrack)" />
</body>
</html>
